import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {Table, Tabs, Card} from 'antd';
import {conventEnumValueToString, formatDateTime} from '../../utils';
import {TABLE, DATE_FORMAT} from '../../constants';
import {repairType, subclaimStatus, serviceActivityStatus} from '../../Enum';
import {formatMessage} from '../intl';
import styles from '../style.css';
const {TabPane} = Tabs;
const basePath = fetch.basePath || '';
const url = '/#/dcs/afterSales/claim/';
class ClaimHistoryPanel extends PureComponent {
    setRowClassName(record) {
        if(record.isHighlight)
            return styles.rowRedStyle;
    }
    render() {
        const {data} = this.props;
        const newClaimHis = [
            {
                title: formatMessage({
                    id: 'newClaimHis.code',
                    defaultMessage: '索赔单编号'
                }),
                dataIndex: 'code',
                render: (text, record) => <a href={`${basePath}${url}${record.id}/detail`} target="_blank" rel="noopener noreferrer">
                    {record.code}</a>
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.repairDate',
                    defaultMessage: '维修日期'
                }),
                dataIndex: 'repairDate',
                render: text => formatDateTime(text, DATE_FORMAT)
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.status',
                    defaultMessage: '状态'
                }),
                dataIndex: 'status',
                render: text => conventEnumValueToString(subclaimStatus, text)
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.causePartCode',
                    defaultMessage: '零件号'
                }),
                dataIndex: 'causePartCode'
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.causePartName',
                    defaultMessage: '零件名称'
                }),
                dataIndex: 'causePartName'
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.faultItemCode',
                    defaultMessage: '故障代码'
                }),
                dataIndex: 'faultItemCode',
                render: (text, r) => `(${r.faultItemCode})${r.faultItemName}`
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.dealerCode',
                    defaultMessage: '服务站编号'
                }),
                dataIndex: 'dealerCode'
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.vin',
                    defaultMessage: 'VIN'
                }),
                dataIndex: 'vin'
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.productCategoryCode',
                    defaultMessage: '车型'
                }),
                dataIndex: 'productCategoryCode'
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.isKD',
                    defaultMessage: 'CBU/KD'
                }),
                dataIndex: 'isKD',
                render: text => {
                    if(text === true)
                        return formatMessage({
                            id: 'tablePanel.column.kd',
                            defaultMessage: 'KD'
                        });
                    if(text === false)
                        return formatMessage({
                            id: 'tablePanel.column.cbu',
                            defaultMessage: 'CBU'
                        });
                    return text;
                }
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.saleDate',
                    defaultMessage: '实销日期'
                }),
                dataIndex: 'saleDate',
                render: text => formatDateTime(text, DATE_FORMAT)
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.submitTime',
                    defaultMessage: '提交时间'
                }),
                dataIndex: 'submitTime',
                render: text => formatDateTime(text, DATE_FORMAT)
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.mileage',
                    defaultMessage: '行驶里程'
                }),
                dataIndex: 'mileage'
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.repairType',
                    defaultMessage: '索赔类型'
                }),
                dataIndex: 'repairType',
                render: text => conventEnumValueToString(repairType, text)
            },
            {
                title: formatMessage({
                    id: 'newClaimHis.checkApproveComment',
                    defaultMessage: '索赔员审核意见'
                }),
                dataIndex: 'checkApproveComment'
            }
        ];
        const maintainHis = [
            {
                title: formatMessage({
                    id: 'maintainHis.dealerCode',
                    defaultMessage: '总代编号'
                }),
                dataIndex: 'dealerCode'
            },
            {
                title: formatMessage({
                    id: 'maintainHis.subDealerCode',
                    defaultMessage: '经销商编号'
                }),
                dataIndex: 'subDealerCode'
            },
            {
                title: formatMessage({
                    id: 'maintainHis.vin',
                    defaultMessage: 'VIN'
                }),
                dataIndex: 'vin'
            },
            {
                title: formatMessage({
                    id: 'maintainHis.maintainDate',
                    defaultMessage: '保养日期'
                }),
                dataIndex: 'maintainDate',
                render: text => formatDateTime(text, DATE_FORMAT)
            },
            {
                title: formatMessage({
                    id: 'maintainHis.mileage',
                    defaultMessage: '行驶里程'
                }),
                dataIndex: 'mileage'
            },
            {
                title: formatMessage({
                    id: 'maintainHis.repairOrder',
                    defaultMessage: '派工单号'
                }),
                dataIndex: 'repairOrder'
            },
            {
                title: formatMessage({
                    id: 'maintainHis.remark',
                    defaultMessage: '备注'
                }),
                dataIndex: 'remark'
            }
        ];
        const technologyUpHis = [
            {
                title: formatMessage({
                    id: 'technologyUpHis.brandCode',
                    defaultMessage: '品牌'
                }),
                dataIndex: 'brandCode'
            },
            {
                title: formatMessage({
                    id: 'technologyUpHis.serviceName',
                    defaultMessage: '技术活动主题'
                }),
                dataIndex: 'serviceName'
            },
            {
                title: formatMessage({
                    id: 'technologyUpHis.content',
                    defaultMessage: '主要内容'
                }),
                dataIndex: 'content'
            },
            {
                title: formatMessage({
                    id: 'technologyUpHis.startTime',
                    defaultMessage: '开始时间'
                }),
                dataIndex: 'startTime',
                render: text => formatDateTime(text, DATE_FORMAT)
            },
            {
                title: formatMessage({
                    id: 'technologyUpHis.endTime',
                    defaultMessage: '结束时间'
                }),
                dataIndex: 'endTime',
                render: text => formatDateTime(text, DATE_FORMAT)
            },
            {
                title: formatMessage({
                    id: 'technologyUpHis.status',
                    defaultMessage: '状态'
                }),
                dataIndex: 'status',
                render: text => conventEnumValueToString(serviceActivityStatus, text)
            }
        ];
        return (
            <div>
                <Tabs defaultActiveKey="1">
                    <TabPane tab={formatMessage({
                        id: 'claimHistoryPanel.operation.claimHis',
                        defaultMessage: '索赔记录'
                    })} key="1">
                        <Card title={formatMessage({
                            id: 'claimHistoryPanel.card.claim',
                            defaultMessage: '索赔记录'
                        })}>
                            <Table
                                className="white-space-nowrap"
                                rowKey="id"
                                columns={newClaimHis}
                                pagination={false}
                                rowClassName={this.setRowClassName}
                                dataSource={data.claimHis ? data.claimHis.newClaimHis : []}
                                {...TABLE}/>
                        </Card>
                    </TabPane>
                    <TabPane tab={formatMessage({
                        id: 'claimHistoryPanel.operation.maintainHis',
                        defaultMessage: '保养记录'
                    })} key="2">
                        <Table
                            className="white-space-nowrap"
                            rowKey="id"
                            columns={maintainHis}
                            pagination={false}
                            dataSource={data.maintainHis}
                            {...TABLE}/>
                    </TabPane>
                    <TabPane tab={formatMessage({
                        id: 'claimHistoryPanel.operation.technologyUpHis',
                        defaultMessage: '技术升级记录'
                    })} key="3">
                        <Table
                            className="white-space-nowrap"
                            rowKey="id"
                            columns={technologyUpHis}
                            pagination={false}
                            dataSource={data.technologyUpHis}
                            {...TABLE}/>
                    </TabPane>
                </Tabs>
            </div>
        );
    }
}

ClaimHistoryPanel.propTypes = {
    data: PropTypes.object
};

export default ClaimHistoryPanel;
